import { Pressable, View } from "react-native";
import styles from "./index.style";
import React from "react";
import Ionicons from "@expo/vector-icons/Ionicons";
import Icon from "react-native-vector-icons/MaterialIcons";
import useChatMessageStore from "@/store/chat-message";
import useChatDetailPageStateStore from "@/store/chat-detail-page";

export default function MultipleSelectBottomBar() {
  const { selectedMessages } = useChatDetailPageStateStore().state;
  const { setSelectedMessage } = useChatDetailPageStateStore().actions;
  const { deleteMessage } = useChatMessageStore().actions.async;

  return (
    <View style={styles.bottomBar}>
      <Pressable
        onPress={() => {
          console.log("逐条转发");
        }}
      >
        <Ionicons
          style={styles.icon}
          name="share-outline"
          size={24}
          color="gray"
        />
      </Pressable>
      <Pressable
        onPress={async () => {
          selectedMessages.forEach((messageId) => {
            deleteMessage({ messageId, ownerId: "" });
            setSelectedMessage(messageId);
          });
        }}
      >
        <Icon style={styles.icon} name="delete" size={24} color="red" />
      </Pressable>
    </View>
  );
}
